<template>
	<view>
		<!-- 底部 -->
		<view class="footer">
			<view style="padding-bottom: 5rpx;">
				<!-- 首页 -->
				<view @tap="goHome()">
					<view class="images_md"><image class="images_md" style="width: 46rpx;height: 46rpx;"  :src="tab=='home'?'../../static/footer/footer1_2.png':'../../static/footer/footer1_1.png'"  mode="widthFix"></image></view>
					<view class="myFont_sm" style="" :class="tab=='home'?'tabbar_active':'tabbar_active2'">首页</view>
				</view>
				
				<view  @tap="govideo()">
					<view class="images_md"><image class="images_md" style="width: 46rpx;height: 46rpx;"  :src="tab=='fu'?'../../static/footer/footer2_2.png':'../../static/footer/footer2_1.png'"  mode="widthFix"></image></view>
					<view class="myFont_sm" style="" :class="tab=='fu'?'tabbar_active':'tabbar_active2'">服务</view>
				</view>
				
				<view  @tap="goSquare()">
					<view class="images_md"><image class="images_md" style="width: 90rpx;height: 48rpx;" src="../../static/footer/footer3_1.png" mode="widthFix"></image></view>
					<view class="myFont_sm" style="" :class="tab=='square'?'tabbar_active3':'tabbar_active2'">活动</view>
				</view>
				
				
				
				<!-- 我的 -->
				<view @tap="goUser()">
					<view class="images_md"><image class="images_md" style="width: 46rpx;height: 46rpx;"  :src="tab=='user'?'../../static/footer/footer4_2.png':'../../static/footer/footer4_1.png'"  mode="widthFix"></image></view>
					<view class="myFont_sm" style="" :class="tab=='user'?'tabbar_active':'tabbar_active2'">我的</view>
				</view>
			</view>
			
			<!-- <view class="pushPro" :class="active==true?'actives':''">
				<view class="my_padding_lr" @click="upload">
					<image class="images_lg" src="http://e.moo9995.com/img/old_picture/a.png" mode="widthFix"></image>
					<view class="myFont_md" style="text-align: center;">发图文</view>
				</view>
				<view class="my_padding_lr" @click="uploadAudio">
					<image class="images_lg" src="../../static/img/video.png" mode="widthFix"></image>
					<view class="myFont_md" style="text-align: center;">发视频</view>
				</view>
			</view> -->
		</view>
		<!-- 发布 -->
		<!-- <view style="width: 100%;height: 100upx;"></view> -->
	</view>
</template>

<script>
	export default{
		props:{
			tab:""
		},
		data:function(){
			return {
				active:false
			}
		},
		onLoad() {
		},
		methods:{
			uploadAudio(){
				// this.active=!this.active
				uni.navigateTo({
					url:"/pages/home/home",
					 animationType: 'pop-in',
					    animationDuration: 200
				})
			},
			shoppings(){
				uni.navigateTo({
					url:"/pages/home/home",
					 animationType: 'pop-in',
					    animationDuration: 200
				})
			},
			// 我的页面
			goUser(){
				uni.navigateTo({
					// url:"/pages/user/PersonCenter"
					url:"/pages/personal/personal",
					 animationType: 'pop-in',
					    animationDuration: 200
				})
			},
			// 首页
			goHome(){
				uni.navigateTo({
					url:"/pages/home/home",
					 animationType: 'pop-in',
					    animationDuration: 200
				})
			},
			goSquare(){
				uni.navigateTo({
					url:"/pages/activity/activity",
					 animationType: 'pop-in',
					    animationDuration: 200
				})
			},
			govideo(){
				uni.navigateTo({
					url:"/pages/service/service",
					 animationType: 'pop-in',
					    animationDuration: 200
				})
			}
		}
	}
</script>

<style>
	.footer{
		position: fixed;
		z-index: 9999;
		bottom: 0;
		height: 100upx;
		width: 100vw;
		background: #FFFFFF;
		/* border-top: 2upx solid rgba(100,100,100,.2); */
		box-shadow: #666 0px 8px 20px 0px;
		box-sizing: border-box;
	}
	.footer>view:first-child{
		width: 100%;
		box-sizing: border-box;
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
		position: relative;
		background: #FFFFFF;
		height: 100%;
		z-index: 1;
	}
	.footer>view:first-child>view{
		text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.middle_tabbar{
		position: absolute;
		top: -40upx;
	}
	.middle_tabbar>view:first-child{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.tabbar_active{
		color: #FF3702;
		font-size: 30rpx;
	}
.tabbar_active3{
	color: #fff;
	width:86rpx ;
	height: 40rpx;
	text-align: center;
line-height: 40rpx;
	font-size: 30rpx;
	background: #FD5001;
	border-radius: 18rpx;
}
	.tabbar_active2{
		font-size: 26rpx;
		color: #9393AA;
	}
	.pushPro{
		width: 100vw;
		height: 200upx;
		position: fixed;
		bottom: -300upx;
		opacity: .1;
		background: #FFFFFF;
		transition-duration:.3s;
		transition-timing-function:linear;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 16upx 36upx;
	}
	.actives{
		bottom: 100upx;
		opacity: 1;
	}
</style>
